<template>
  <div>
    <nav-header :headerTitle="'帮助页面'" :navBgColor="'#fff'"></nav-header>
    <div class="nav-height"></div>
    <div class="help">
      <div class="list" v-for="item in helpList" :key="item">
        <p class="title">{{item.modulesName}}</p>
        <template v-for="modulesItem in item.modules">
          <div
            class="help-item" 
            :key="modulesItem.name" 
            @click="goUrl(modulesItem.path)"
          >{{modulesItem.title}}</div>
        </template>
        
      </div>
    </div>
  </div>
</template>
<script>
import navHeader from "@/components/NavHeader";
import mixin from "@/utils/mixin"; 
/**广告主首页模块   */
import advertiserIndex from "@/router/advertiserIndex"
/**广告主我的模块   */
import advertiserMine from "@/router/advertiserMine"
/**流量主-我的   */
import influenceMine from "@/router/influenceMine"
/**流量主-登录模块   */
import influencerLogin from "@/router/influencerLogin"
/**流量主-广场模块   */
import influencerSquare from "@/router/influencerSquare"
/**流量主-广场模块   */
import otherRouter from "@/router/otherRouter"
const helpList = [
  {
    modulesName: "广告主-首页",
    modules: [
      ...advertiserIndex
    ]
  },
  {
    modulesName: "广告主-我的",
    modules: [
      ...advertiserMine
    ]
  },
  {
    modulesName: "流量主-登录",
    modules: [
      ...influencerLogin
    ]
  },
  {
    modulesName: "流量主-首页",
    modules: [
      ...influencerSquare
    ]
  },
  {
    modulesName: "流量主-我的",
    modules: [
      ...influenceMine
    ]
  }, 
  {
    modulesName: "其他文件",
    modules: [
      ...otherRouter
    ]
  }
];
export default {
  name: "help",
  mixins: [mixin],
  components: {
    navHeader
  },
  data() {
    return {
      helpList
    };
  },
  mounted() {},
  methods: {}
};
</script>

<style scoped lang="scss">
.help {
  .list {
    .title {
      padding: 34px;
      color: #000;
      text-align: center;
      font-size: 34px;
      font-weight: 700;
      background: #d0c0c00f;
    } 
    .help-item {
      width: 100%;
      height: 88px;
      font-size: 28px;
      text-align: center;
      line-height: 88px;
      color: #fff;
      background: #f47042;
      &:hover {
        cursor: pointer;
      }
      &:nth-child(2n + 1) {
        background: #f94242;
      }
    }
  }
}
</style>
